<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>Register</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.css}"/>
</head>
<body class="container">
<br/>
<h1>Register</h1>
<br/><br/>
<div class="with:80%">
    <form class="form-horizontal" th:action="@{/register}" method="post" th:object="${userEntity}">

        <div class="form-group">
            <label for="username" class="col-sm-2 control-label">Username</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" name="username" id="username" placeholder="username" th:field="*{username}"/>
                <td th:if="${#fields.hasErrors('username')}" th:errors="*{username}">Username Error</td>
            </div>
        </div>

        <div class="form-group">
            <label for="password" class="col-sm-2 control-label">Password</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" name="password" id="password" placeholder="password" th:field="*{password}"/>
                <td th:if="${#fields.hasErrors('password')}" th:errors="*{password}">Password Error</td>
            </div>
        </div>

        <div class="form-group">
            <label for="username">Please select the role:</label>
            <select class="form-control" name="role">
                <option>ROLE_ADMIN</option>
                <option>ROLE_USER</option>
            </select>
        </div>

        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <input type="submit" value="Submit" class="btn btn-info"/>
                <input type="reset" value="Reset" class="btn btn-info"/>
            </div>
        </div>
    </form>
</div>
</body>
</html>
